<template>
    <div>
        <!-- 消息提示窗 -->
        <div style="padding: 0px 2px" :title="'消息提醒' + (getCurrentTimeStr() || '') + ':' + (msg.msg || '')">
            <span class="pro-tips" :style="{
          color: msg.color || 'lightgray',
          height: msg.height || '20px',
        }">消息提醒{{ getCurrentTimeStr() || "" }}: {{ msg.msg || "" }}</span>
        </div>
    </div>
</template>
<script>
export default {
    name: "MessageBox",
    props: ["msg"],
    methods: {
        //获取当前时间字符串
        getCurrentTimeStr() {
            if (this.msg.msg) {
                let date = new Date();
                let year = date.getFullYear();
                let month = date.getMonth() + 1;
                let day = date.getDate();
                let hours = date.getHours();
                let mins = date.getMinutes();
                let sec = date.getSeconds();
                if (month < 10) month = "0" + month;
                if (day < 10) day = "0" + day;
                if (hours < 10) hours = "0" + hours;
                if (mins < 10) mins = "0" + mins;
                if (sec < 10) sec = "0" + sec;
                return (this.timeBox =
                    "(" +
                    year +
                    "-" +
                    month +
                    "-" +
                    day +
                    " " +
                    hours +
                    ":" +
                    mins +
                    ":" +
                    sec +
                    ")");
            } else {
                return "";
            }
        }
    }
};
</script>
<style scoped lang="scss">
//消息提醒框
.pro-tips {
    display: block;
    width: 100%;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
    font-weight: bold;
    background: white;
    padding: 0.1rem 1rem 0.1rem;
    border: 1px solid rgb(214, 212, 212); ////666666  rgb(112, 110, 110)
    overflow: hidden; //隐藏文字
    text-overflow: ellipsis; //显示...
    white-space: nowrap; //不换行
}
</style>